import React, {useEffect, useState} from "react";
import {HashRouter, Route, Routes, Navigate} from 'react-router-dom'
import Login from "../views/Login";
import NewsSandBox from "../views/NewsSandBox";
import Home from "../views/NewsSandBox/Home";
import RoleList from "../views/NewsSandBox/RightManage/RoleList";
import RightList from "../views/NewsSandBox/RightManage/RightList";
import NoPermission from "../views/NewsSandBox/NoPermission";
import NewsAdd from "../views/NewsSandBox/NewsManage/NewsAdd";
import NewsDraft from "../views/NewsSandBox/NewsManage/NewsDraft";
import NewsCategory from "../views/NewsSandBox/NewsManage/NewsCategory";
import Audit from "../views/NewsSandBox/AuditManage/Audit";
import AuditList from "../views/NewsSandBox/AuditManage/AuditList";
import UnPublished from "../views/NewsSandBox/PublishManage/UnPublished";
import Published from "../views/NewsSandBox/PublishManage/Published";
import Sunset from "../views/NewsSandBox/PublishManage/Sunset";
import axios from "axios";
import UserManege from "../views/NewsSandBox/UserManage";
import NewsPreview from "../views/NewsSandBox/NewsManage/NewsPreview";
import NewsUpdate from "../views/NewsSandBox/NewsManage/NewsUpdate";
import Detail from "../views/Tourists/Detail";
import News from "../views/Tourists/News";

const LocalRouterMap = {
    "/home": <Home />,
    "/user-manage/list": <UserManege />,
    "/right-manage/role/list": <RoleList />,
    "/right-manage/right/list": <RightList />,
    "/news-manage/add": <NewsAdd />,
    "/news-manage/draft": <NewsDraft />,
    "/news-manage/category": <NewsCategory />,
    "/news-manage/preview/:id": <NewsPreview />,
    "/news-manage/update/:id": <NewsUpdate />,
    "/audit-manage/audit": <Audit />,
    "/audit-manage/list": <AuditList />,
    "/publish-manage/unpublished": <UnPublished />,
    "/publish-manage/published": <Published />,
    "/publish-manage/sunset": <Sunset />
};

export default function IndexRouter() {
    const [BackRouteList, setBackRouteList] = useState([])
    useEffect(() => {
        Promise.all([
            axios.get("/rights"),
            axios.get("/children"),
        ]).then(res => {
            // console.log(res)
            setBackRouteList([...res[0].data, ...res[1].data])
            // console.log(BackRouteList)
        })
    }, []);

    const { role } = JSON.parse(localStorage.getItem("token")) || {};

    const checkRoute = (item) => {
        return LocalRouterMap[item.key] && (item.pagepermisson || item.routepermisson)
    };

    const checkUserPermission = (item) => {
        if (localStorage.getItem("token") == null)
            return ;
        return role.rights.includes(item.key)
    }
    return (
        <HashRouter>
            <Routes>
                <Route path="/login" element={<Login/>}/>
                <Route path='/news' element={<News />}/>
                <Route path='/detail/:id' element={<Detail />}/>
                <Route path="/" element={
                    localStorage.getItem("token") !== null ? <NewsSandBox/> : <Navigate to="/login"/>
                }>
                    {
                        BackRouteList.map(item=>{
                            if (checkRoute(item) && checkUserPermission(item)) {
                                return <Route path={item.key} key = {item.key}
                                              element={LocalRouterMap[item.key]} />
                            }
                            return null
                        })
                    }
                    <Route path="/" element={<Navigate to="/home"/>} exact />
                    {
                        BackRouteList.length > 0 && <Route path="*" element={<NoPermission />}/>
                    }
                </Route>
            </Routes>
        </HashRouter>
    )
}
